<template>
	<div>

		<div class="app-container">

			<TopInfo />

			<Search :lookup="data.lookup" @investigate="inves" />

			<div class="w-full flex">

				<div class="w-1/2 leading-9 text-base">
					{{ $t('report.sales.Lasttime') }}: 2024-04-08 16:09:43
				</div>

				<div class="w-1/2 text-right">
					<el-button v-prmis="'stock_report_exportBySku'" type="primary" @click="getspread('1')">{{
						$t('report.stock.export') }}</el-button>
					<el-button v-prmis="'stock_report_exportByMachine'" type="primary" @click="getspread('2')">{{
						$t('report.stock.export2') }}</el-button>
				</div>

			</div>

		</div>

		<div class="app-container" v-loading="data.mtloading">

			<el-table :data="data.list" :header-cell-style="{ 'text-align': 'center' }"
				:cell-style="{ 'text-align': 'center' }" class="w-full" height="700">

				<el-table-column prop="sku" label="SKU" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.sku || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="g_name" :label="$t('machine.goods.name')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.g_name || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="bar_code" :label="$t('report.stock.barCode')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.bar_code || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="model" :label="$t('machine.goods.marque')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.model || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="mc_stock" :label="$t('machine.channel.inventory')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.mc_stock || '0' }}
					</template>
				</el-table-column>

				<el-table-column prop="pre_stock" :label="$t('report.stock.preStock')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.pre_stock || '0' }}
					</template>
				</el-table-column>

				<el-table-column prop="standby_stock" :label="$t('report.stock.Inventory')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.standby_stock || '0' }}
					</template>
				</el-table-column>

				<el-table-column prop="bad_stock" :label="$t('report.stock.Bad')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.bad_stock || '0' }}
					</template>
				</el-table-column>

				<el-table-column prop="total_stock" :label="$t('public.total')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.total_stock || '0' }}
					</template>
				</el-table-column>

				<el-table-column prop="retail_price" :label="$t('report.stock.sellPrice')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.retail_price || '0.00' }}
					</template>
				</el-table-column>

			</el-table>

			<PageNum :total="data.total" :page="data.stock" @exposeData="current" @fraction="fraction" />

		</div>
		<exports :dialogVisible="dialogExport" @close="dialogExport = false" />
	</div>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
const { t: $t } = useI18n()
import TopInfo from '@/components/TopInfo/index.vue';
import Search from '@/components/Search/index.vue';
import PageNum from '@/components/PageNum/index.vue';
import { getstockreportList, exportstockBySku, exportstockByMachine } from '@/api/report';
import { ElMessage, ElMessageBox } from "element-plus";
import exports from '@/components/export.vue';
const dialogExport = ref(false)
let data = reactive({
	mtloading: false, // 加载
	lookup: [ // 筛选栏
		{ title: $t('machine.code'), type: 'mId', value: '', key: 'm_id' },
		{ title: 'SKU', type: 'input', value: '', key: 'sku' },
		{ title: $t('machine.goods.name'), type: 'input', value: '', key: 'g_name' },
	],
	list: [], // 列表信息
	stock: { // 筛选数据
		m_id: '',
		sku: '',
		page: 1,
		pageNum: 15
	},
	total: 0, // 总条数
})

// 获取列表信息
let getlist = () => {
	data.mtloading = true
	getstockreportList(data.stock).then(res => {
		data.mtloading = false
		if (res.state == 200) {
			data.list = res.data.data
			data.total = res.data.total
		}
	})
}

// 查询回调
let inves = (e) => {
	for (let key in e) {
		data.stock[key] = e[key]
	}
	data.stock.page = 1
	data.stock.pageNum = 15
	getlist()
}

// 导出
let getspread = (e) => {
	ElMessageBox.confirm($t('message.isExport')).then(res => {
		getexcel(e)
	}).catch(err => {
		console.log('取消')
	})
}

// 触发导出
let getexcel = async (e) => {
	let obj = {
		m_id: data.stock.m_id,
		sku: data.stock.sku
	}

	let res = ''

	if (e == '1') {
		res = await exportstockBySku(obj)
	} else {
		res = await exportstockByMachine(obj)
	}

	if (res.state == 200) {
		dialogExport.value = true
	} else {
		ElMessage({
			message: $t('message.network'),
			type: 'error'
		})
	}

}

// 页数回调
let current = (e) => {
	data.stock.page = e
	getlist()
}

// 条数回调
let fraction = (e) => {
	data.stock.pageNum = e
	getlist()
}

getlist()

</script>
